<template>
  <div>
    <!--条件筛选-->
    <TopFilter :list="topFilterList" :cols="3" :collapse="boolean" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <!--操作 -->
    <button-area :style="{ paddingLeft: '80px' }"></button-area>
    <!-- 列筛选-->
    <FilterTable
      ref="table"
      columnsRef="lhmStationUtilize"
      :columns="columns"
      :fetchapi="fetchApi"
      :isSelectColumn="isSelectColumn"
      :params="fetchParams"
      :datakey="'rows'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectData"
    >
      <!--列操作-->
      <template slot="controls"> </template>
    </FilterTable>
  </div>
</template>

<script>
import moment from 'moment';
import { dictionary } from '@/utils/dictMixin';
import { getStationUtilize } from '@/api/repair/queryStatistics/queryAccounts';
// 工位利用率
export default {
  name: 'LHMStationUtilize',
  components: {},
  mixins: [dictionary],
  data() {
    this.conf = { add: '新增', delete: '删除', edit: '编辑', show: '显示' };
    return {
      topFilterList: this.createTopFilterList(),
      fetchParams: {xhrAbort: true},
      visible: false,
      visible1: false,
      boolean: false,
      isSelectColumn: false,
      dialogTitle: '',
      fetchApi: getStationUtilize,
      columns: this.createTableColumns(),
      handleType: '',
      formData: {},
      tableData: [],
      ids: []
    };
  },
  mounted() {
    // 分页
    this.BaseTable = this.$refs.table.$refs.pageTable;
    this.fetchParams=Object.assign(this.fetchParams, {
      beginDate:moment(new Date()).subtract(6, "days").format("YYYY-MM-DD"),
      endDate: moment(new Date()).format('YYYY-MM-DD'),
      xhrAbort: false
    })
  },
  methods: {
    createTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '日期',
          fieldName: 'beginDate|endDate',
          placeholder: '选择日期',
          initialValue: [moment(new Date()).subtract(6, "days").format("YYYY-MM-DD"), moment(new Date()).format('YYYY-MM-DD')],
          rules: [{ required: true, message: '请选日期范围', trigger: 'change' }]
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '工位代码',
          dataIndex: 'LABOUR_POSITION_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '工位名称',
          dataIndex: 'LABOUR_POSITION_NAME',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '实际占用工时',
          dataIndex: 'SJSYSJ',
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '理论可用工时',
          dataIndex: 'LLZYGS',
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '工位利用率',
          dataIndex: 'LYL',
          sorter: true,
          filter: true,
          filterType: 'number'
        }
      ];
    },
    selectData(val) {
      this.tableData = val;
    },
    addHandle() {
      // 新建
      this.handleType = 'add';
      // this.formData = row;
      this.showHandler();
    },
    editHandle(row) {
      this.handleType = 'edit'; // 编辑

      this.showHandler();
    },
    changeHandle(val) {
      this.fetchParams = Object.assign({}, val);
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    // async saveDialog() {
    //   let res = {};
    //   if(this.tableData==null) return
    //     res = await addCustomeRgradeUpdatet({customeRgradeUpdateDTOList:this.tableData });
    //   if (res.resultCode === 200) {
    //     this.closeDialog('refresh');
    //   }
    // },
    showHandler() {
      // 显示
      this.dialogTitle = `查看结算记录`;
      this.visible = true;
    },
    closeHandler(val, type) {
      // 关闭
      this.visible = val;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
    }
  }
};
</script>

<style lang="less" scoped></style>
